//
//  ChartCategoryView.swift
//  KoiAccounting
//
//  Created by 纪洪文 on 05.04.25.
//

import SwiftUI
import Charts

struct ChartCategoryView: View {
    
    @Binding var date: Date
    @Binding var categoryTitle: String
    @Binding var pieData:[ChartPieItem]
    @Binding var koiPieData:[(value:Double, color:Color)]
    @Binding var categoryAmountList:[CategoryAmount]
    var dateSelectType : DateSelectType
    var onCategoryItemClick:(AccountingCategory) -> Void
    
    var body: some View {
        VStack {
            HStack {
                Text(categoryTitle)
                    .font(.system(size: 14))
                    .fontWeight(.medium)
                    .foregroundColor(Color.koiColorTitle)
                Spacer()
            }
            HStack (alignment: .top) {
                if #available(iOS 17.0, *) {
                    Chart {
                        ForEach(pieData, id:\.self.category.id) { item in
                            SectorMark(
                                angle: .value(item.category.name.orEmpty, item.percent),
                                innerRadius:.ratio(0.6),
                                angularInset:2
                            )
                            .cornerRadius(5)
                            .foregroundStyle(item.color)
                        }
                    }
                    .frame(width: 120, height: 120)
                } else {
                    KoiPie(slices: $koiPieData)
                        .frame(width: 120, height: 120)
                }
                Spacer()
                if pieData.count == 1 && pieData.first?.category.name == "" {
                    Text("无数据")
                        .font(.system(size: 18))
                        .foregroundColor(Color.koiColorTitleSecond)
                        .frame(maxHeight: .infinity)
                        .padding(.trailing, 30)
                } else {
                    VStack (alignment: .leading) {
                        ForEach(pieData, id:\.self.category.id) { item in
                            HStack {
                                item.color.frame(width: 10, height: 10).cornerRadius(3)
                                Text(item.getNameAndPercent())
                                    .font(.system(size: 10))
                                    .foregroundColor(Color.koiColorTitleSecond)
                            }
                        }
                    }
                }
            }
            .padding(.vertical, 30)
            VStack {
                ForEach(categoryAmountList, id:\.self.category.id) { item in
                    Button(action: {
                        onCategoryItemClick(item.category)
                    }) {
                        ChartCategoryItemView(item: item)
                    }
                }
            }
        }
        .padding(16)
        .background(Color.koiColorBackgroundItem)
        .cornerRadius(16)
    }
}

@available(iOS 18.0, *)
#Preview {
    
    @Previewable @State var date: Date = Date()
    @Previewable @State var categoryTitle: String = "类别支出统计"
    @Previewable @State var pieData = [
        ChartPieItem(category: AccountingCategory(id:1, name:"餐饮", icon: "linearicon://koi_rice"), amount: 100, percent: 0.25, color: Color.red),
        ChartPieItem(category: AccountingCategory(id:2, name:"交通", icon: "linearicon://koi_bus_stop"), amount: 100, percent: 0.25, color: Color.green),
        ChartPieItem(category: AccountingCategory(id:3, name:"娱乐", icon: "linearicon://koi_videogames"), amount: 200, percent: 0.5, color: Color.blue)
    ]
    
    @Previewable @State var koiPieData = [
        (value:0.25, color: Color.red),
        (value:0.25, color: Color.green),
        (value:0.5, color: Color.blue),
    ]
    
    @Previewable @State var categoryAmountList = [
        CategoryAmount(category: AccountingCategory(id:1, name:"餐饮", icon: "linearicon://koi_rice"), amount: 100, percent: 0.25),
        CategoryAmount(category: AccountingCategory(id:2, name:"交通", icon: "linearicon://koi_bus_stop"), amount: 100, percent: 0.25),
        CategoryAmount(category: AccountingCategory(id:3, name:"娱乐", icon: "linearicon://koi_videogames"), amount: 200, percent: 0.5)
    ]
    
    ChartCategoryView(
        date: $date,
        categoryTitle: $categoryTitle,
        pieData: $pieData,
        koiPieData: $koiPieData,
        categoryAmountList: $categoryAmountList,
        dateSelectType: .week,
        onCategoryItemClick: { _ in }
    )
}
